<template>
  <div>
    <el-row>
      <el-col :span="24" class="exp">
        <el-button
          :type="primary1"
          @click="
            () => {
              this.chooes = true;
              this.primary1 = 'primary';
              this.primary2 = 'null';
            }
          "
          ><p>
            每秒钟一只巨型蚂蚁吸收的氧气量=<b style="color:yellow;">
              {{ result1 }}
            </b>
            （毫升）
          </p></el-button
        >
      </el-col>
    </el-row>
    <!-- <el-row>
      <el-col :span="24" class="exp"
        ><el-button
          :type="primary2"
          @click="
            () => {
              this.chooes = false;
              this.primary1 = 'null';
              this.primary2 = 'primary';
            }
          "
          >每秒钟一只正常蚂蚁吸收氧气量={{ result2 }}（毫升）</el-button
        >
      </el-col>
    </el-row> -->
    <el-row style="width:550px;height:30px;font-size:30px;margin: 30px 200px;">
      <el-col :span="24">虚拟键盘</el-col>
    </el-row>
    <el-row style="width:430px;margin-left:50px;border:1px solid #000;">
      <el-button
        type="success"
        v-for="(item, index) in numlist"
        :key="index"
        @click="recordtext(item)"
        class="btn"
        >{{ item }}</el-button
      ></el-row
    >
  </div>
</template>

<script>
export default {
  created() {
    this.result1 = this.$store.state.answer[8];
    this.result2 = this.$store.state.answer[9];
  },
  data() {
    return {
      result1: "",
      result2: "",
      chooes: "true",
      primary1: "primary",
      primary2: "null",
      numlist: [1, 2, 3, 4, 5, 6, 7, 8, 9, ".", 0, "删除"],
    };
  },
  methods: {
    updata() {
      console.log(this.$store.state.pagenum, this.$store.state.answer);
      parent.postMessage(this.$store.state, "*");
    },
    recordtext(item) {
      if (this.chooes) {
        if (item === "删除") {
          this.result1 = this.result1.substr(0, this.result1.length - 1);
        } else {
          this.result1 = this.result1 + item;
        }
        this.$store.state.answer[8] = this.result1;
      } else {
        if (item === "删除") {
          this.result2 = this.result2.substr(0, this.result2.length - 1);
        } else {
          this.result2 = this.result2 + item;
        }
        this.$store.state.answer[9] = this.result2;
      }
      this.updata();
    },
  },
};
</script>

<style scoped>
button {
  margin: 10px;
  font-size: 20px;
  font-weight: 100;
}
.btn {
  width: 120px;
  font-size: 36px;
  height: 60px;
}
.exp button {
  width: 550px;
  height: 60px;
}
.exp span {
  overflow: auto;
}
</style>
